import React, { Component } from 'react'
// import PubSub from 'pubsub-js'
import axios from 'axios'

export default class Search extends Component {
	search = (params) => {
		//获取用户的输入
		console.log(this.keyWordElement.value)
		//连续解构赋值同时重命名为keyWord（嵌套）
		const { keyWordElement:{value:keyWord}} = this
		//只定义了value未定义keywordElement
		//发送请求前通知App更新状态
		this.props.updateAppState({
			isFirst:false,isLoading:true
		})
		//发送网络请求
		axios.get(`/api1/search/users?q=${keyWord}`).then(
			response =>{
				this.props.updateAppState({
					users:response.data.items,
					isLoading:false
				})
				console.log(`成功了`, response.data)
			},
            error =>{console.log(`成功了`,error)
			this.props.updateAppState({
				isLoading:false,
				err:error.message
			})
			}
		)
	}


	render() {
		return (
			<section className="jumbotron">
				<h3 className="jumbotron-heading">搜索github用户</h3>
				<div>
					<input ref={c=>this.keyWordElement = c} type="text" placeholder="输入关键词点击搜索"/>&nbsp;
					<button onClick={this.search}>搜索</button>
				</div>
			</section>
		)
	}
}
